

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>跨终端上传的demo</title>
    <script src="http://g.tbcdn.cn/??kissy/k/1.3.1/seed-min.js" charset="utf-8"></script>
</head>
<body id="err-page"><script type="text/javascript">
    (function (d) {
        var t=d.createElement("script");t.type="text/javascript";t.async=true;t.id="tb-beacon-aplus";
        t.setAttribute("exparams","category=&userid=69738207&aplus");
        t.src=("https:"==d.location.protocol?"https://s":"http://a")+".tbcdn.cn/s/aplus_v2.js";
        d.getElementsByTagName("head")[0].appendChild(t);
    })(document);
</script>

<div id="page">
    <div id="content" class="grid-c">
        <h2>跨终端上传的demo</h2>

        <p>手机部分的上传由常胤和国梁完成，感谢他们富有想象力的尝试。</p>
        <p>页面用户的id是：69738207</p>
        <ul id="J_UploaderQueue" class="grid">
            <li class="g-u">
                <div class="upload-inner">
                    <b></b>
                    <div class="operate">
                        <input type="file" id="J_UploaderBtn" value="电脑上传" name="imgFile"  accept="image/*" >
                        <a class="mobile-upload-button" href="javascript:void(0);" id="J_MobileUpload" inited="1">手机上传</a>
                    </div>
                </div>
                <input type="hidden" id="J_Urls" name="urls">
            </li>
        </ul>

        <script type="text/javascript">
            var S = KISSY;
            S.config({
                packages:[
                    {
                        name:"kg",
                        path:"http://g.tbcdn.cn/kg/",
                        charset:"utf-8",
                        ignorePackageNameInUri:true
                    }
                ]
            });

            if (S.Config.debug) {
                var srcPath = "../src/";
                S.config({
                    packages:[
                        {
                            name:"kg/uploader/2.0.0",
                            path:srcPath,
                            charset:"utf-8",
                            ignorePackageNameInUri:true
                        }
                    ]
                });
            }
            S.use('kg/uploader/2.0.0/aliUploader,kg/uploader/2.0.0/themes/crossUploader/index,kg/uploader/2.0.0/themes/crossUploader/style.css', function (S, AliUploader,CrossUploader) {
                //上传组件插件
                var plugins = 'kg/uploader/2.0.0/plugins/auth/auth,' +
                        'kg/uploader/2.0.0/plugins/urlsInput/urlsInput,' +
                        'kg/uploader/2.0.0/plugins/proBars/proBars,' +
                        'kg/uploader/2.0.0/plugins/filedrop/filedrop,' +
                        'kg/uploader/2.0.0/plugins/preview/preview,' +
                        'kg/uploader/2.0.0/plugins/imageZoom/imageZoom,'+
                        'kg/uploader/2.0.0/plugins/cross/cross';

                S.use(plugins,function(S,Auth,UrlsInput,ProBars,Filedrop,Preview,ImageZoom,Cross){
                    var uploader = new AliUploader('#J_UploaderBtn');
                    var testTheme = new CrossUploader({ queueTarget: '#J_UploaderQueue' });
                    testTheme._successHandler = function(){
                        alert(1);
                    }
                    //使用主题
                    uploader.theme(testTheme);
                    //验证插件
                    uploader.plug(new Auth({
                                //最多上传个数
                                max:5,
                                //图片最大允许大小
                                maxSize:5120
                            }))
                        //url保存插件
                            .plug(new UrlsInput({target:'#J_Urls'}))
                        //进度条集合
                            .plug(new ProBars())
                        //图片预览
                            .plug(new Preview())
                            .plug(new ImageZoom())
                            .plug(new Cross({
                                target:'#J_MobileUpload',
                                token:'aoptoken',
                                biz_subToken:'aoptest',
                                title:"图片",
                                //是否显示图片描述
                                desc:false,
                                userId: '69738207',
                                app : ''
                            }))
                    ;
                });
            })
        </script>
    </div>
</div>
</body>
</html>